<template>
    <view style="margin:20rpx 0">
        <!-- 底部组件、深浅2色系 -->
        <!-- <u-loadmore status="nomore" nomore-text="内蒙古知鱼科技有限公司" />

        <view  class="callBox1" style="display: flex;
    justify-content: center;
    margin-top: 20rpx;
    font-size: 24rpx;">
            联系电话
            <text style="color: #397EFD;border-bottom: 1px solid #397EFD;margin-left: 20rpx;" @tap="makePhoneCall('13294712688')">13294712688</text>
            <text style="color: #397EFD;border-bottom: 1px solid #397EFD;margin-left: 20rpx;" @tap="makePhoneCall('18586063267')">18586063267</text>
            
        </view> -->
    </view>
</template>

<script>
export default {
    name: "cc-bottom",
    props: {
        //主题--参数可选white、black、custom，默认white，传入custom则使用customStyle传入的主题样式,webConfigure获取web端配置
        theme: {
            type: String,
            default: 'white'
        },
        //自定义底部样式
        customStyle: {
            type: Object,
            default: () => {
                return {}
            }
        },
        // 是否固定底部
        isFixed: {
            type: Boolean,
            default: true
        }
    },
    data() {
        return {
            white: {
                color: '#919398', //技术支持字体颜色
                borderColor: '#DDDFE6', //分割线颜色
                companyColor: '#303133', //公司名称字体颜色
                phoneColor: '#303133', //电话号码字体颜色
                // icon: '/static/components/cc-bottom/logo-all.png', //公司logo
                url: '', //公司名称跳转链接
                phoneNumber: '' //电话号码
            },
            // black: {
            // 	color: '#7D7D7D',
            // 	borderColor: '#7D7D7D',
            // 	companyColor: '#DBDBDB',
            // 	phoneColor: '#CFCFD1',
            // icon: '/static/components/cc-bottom/black_logo.png',
            // 	url: '',
            // 	phoneNumber: ''
            // },
            bottomStyle: {}, //渲染底部样式
            phoneHeight: '', //屏幕高度
        };
    },
    mounted() {
        switch (this.theme) {
            case 'white':
                this.bottomStyle = this.white;
                break;
            case 'black':
                this.bottomStyle = this.black;
                break;
            case 'custom':
                this.bottomStyle = this.customStyle;
                break;
            case 'webConfigure':
                this.getBottom();
                break;
            default:
                this.bottomStyle = this.white;
        }
    },
    methods: {
        // 拨打电话
        makePhoneCall(value) {
            uni.makePhoneCall({
                phoneNumber: value
            });
        },
        // 获取底部技术支持配置信息
        getBottom() {
            this.$asynApi.getMobileConfig({}).then(res => {
                if (res.code == 200) {
                    this.bottomStyle = res.data;
                }
            })
        }
    }
}
</script>

<style lang="scss" >
.bottom-container,
.bottom-container-fixed {
    width: 100%;
    padding-bottom: 40rpx;

    .bottom-company {
        width: 100%;
        text-align: center;
        font-size: 26rpx;
        font-weight: bold;
        color: #303133;
        // line-height: 37rpx;
        // margin: 10rpx 0 22rpx;
        display: flex;
        justify-content: center;

        text {
            margin-left: 8rpx;
        }
    }

    .bottom-phone {
        font-size: 24rpx;
        font-weight: 400;
        color: #94949e;
        line-height: 33rpx;
        text-align: center;
    }
}

.bottom-box-fixed {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 999;
}
.callBox1{
    display: flex;
    justify-content: center;
    margin-top: 20rpx;
    font-size: 24rpx;
    text{
        margin-left: 20rpx;
    }
}
</style>
